<ng-include src="template.header">
</ng-include>
<ng-include src="template.sidebar">
</ng-include>
<div class="page-content sidebar-page clearfix">
    <div class="page-content-inner">
        <div id="page-header" class="clearfix">
            <div class="page-header">
                <h2>订单数据罗盘</h2>
            </div>
        </div>
        <div class="row">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="panel tile btlr0 bblr0" data-mh="payments">
                        <div class="panel-body">
                            <div class="col-lg-2 col-md-4 col-sm-4 col-xs-12">
                                <div class="btn-group" role="group">
                                    <button type="button" class="btn btn-primary" ng-model="periodRadio" uib-btn-radio="'day'">日</button>
                                    <button type="button" class="btn btn-primary" ng-model="periodRadio" uib-btn-radio="'week'">周</button>
                                    <button type="button" class="btn btn-primary" ng-model="periodRadio" uib-btn-radio="'month'">月</button>
                                </div>
                            </div>
                            <div class="col-lg-2 col-md-4 col-sm-4 col-xs-12">
                                <div class="input-group">
                                    <input type="text" class="form-control" uib-datepicker-popup="{{format}}" ng-model="dt" is-open="popup.opened" datepicker-options="dateOptions" ng-required="true" close-text="Close" alt-input-formats="altInputFormats" />
                                    <span class="input-group-btn">
                                    <button type="button" class="btn btn-default" ng-click="open()"><i class="glyphicon glyphicon-calendar"></i></button>
                                  </span>
                                </div>
                            </div>
                            <div class="col-lg-2 col-md-4 col-sm-4 col-xs-12">
                                <button type="button" class="btn btn-success" ng-click="fetch()">获取</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row" ng-show="isShowSummery">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="panel tile btlr0 bblr0" data-mh="payments">
                        <div class="panel-heading">
                            <h4 class="panel-title"><i class="fa fa-reorder"></i>周期{{period}}｜开始日{{start}} － 结束日{{end}}</h4>
                        </div>

                        <div class="panel-body">
                            <div class="col-lg-2 col-md-4 col-sm-4 col-xs-12">
                                <div class="panel panel-info tile panelClose panelRefresh" id="dyn_0">
                                    <div class="panel-heading">
                                        <h4 class="panel-title">订单数</h4>
                                    </div>
                                    <div class="panel-body pt0">
                                        <div class="progressbar-stats-1">
                                            <div class="stats">
                                                <i class="l-ecommerce-cart-content"></i>
                                                <span class="pull-right">单</span>
                                                <div class="stats-number" count-to="{{summery.orderNum}}" value="0" duration="1"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="col-lg-2 col-md-4 col-sm-4 col-xs-12">
                                <div class="panel panel-success tile panelClose panelRefresh" id="dyn_1">
                                    <div class="panel-heading">
                                        <h4 class="panel-title">支付订单数</h4>
                                    </div>
                                    <div class="panel-body pt0">
                                        <div class="progressbar-stats-1">
                                            <div class="stats">
                                                <i class="l-ecommerce-money"></i>
                                                <span class="pull-right">单</span>
                                                <div class="stats-number" count-to="{{summery.orderPaidNum}}" value="0" duration="1"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="col-lg-2 col-md-4 col-sm-4 col-xs-12">
                                <div class="panel panel-warning tile panelClose panelRefresh" id="dyn_1">
                                    <div class="panel-heading">
                                        <h4 class="panel-title">渠道支付订单数</h4>
                                    </div>
                                    <div class="panel-body pt0">
                                        <div class="progressbar-stats-1">
                                            <div class="stats">
                                                <i class="l-ecommerce-money"></i>
                                                <span class="pull-right">单</span>
                                                <div class="stats-number" count-to="{{summery.orderCpsNum}}" value="0" duration="1"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
                                <div class="panel panel-danger tile panelClose panelRefresh" id="dyn_2">
                                    <div class="panel-heading">
                                        <h4 class="panel-title">支付金额</h4>
                                    </div>
                                    <div class="panel-body pt0">
                                        <div class="progressbar-stats-1">
                                            <div class="stats">
                                                <i class="l-banknote"></i>
                                                <span class="pull-right">元(人民币)</span>
                                                <div class="stats-number money" count-to="{{summery.paidAmount}}" value="0" duration="1"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
                                <div class="panel panel-default tile panelClose panelRefresh" id="dyn_3">
                                    <div class="panel-heading">
                                        <h4 class="panel-title">客单价</h4>
                                        <div class="panel-controls panel-controls-right">
                                            <a href="#" class="panel-refresh"></a>
                                        </div>
                                        <div class="panel-body pt0">
                                            <div class="progressbar-stats-1 dark">
                                                <div class="stats">
                                                    <i class="l-banknote"></i>
                                                    <span class="pull-right">元(人民币)</span>
                                                    <div class="stats-number money" count-to="{{summery.pct}}" value="0" duration="1"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>

            <div class="row" ng-show="isShowDetail">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="panel tile btlr0 bblr0" data-mh="payments">
                        <div class="panel-heading">
                            <h4 class="panel-title"><i class="fa fa-chart"></i>子时间维度分析</h4>
                        </div>
                        <div class="panel-body">
                            <div class="row">
                                <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                                    <h4>订单走势</h4>
                                    <canvas class="chart chart-line" chart-data="ordernum.data" chart-labels="ordernum.labels" chart-series="ordernum.series"></canvas>
                                </div>

                                <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                                    <h4>付款金额走势</h4>
                                    <canvas class="chart chart-line" chart-colors="paidordernum.colors" chart-data="paidordernum.data" chart-labels="paidordernum.labels" chart-series="paidordernum.series"></canvas>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                                    <h4>支付率走势</h4>
                                    <canvas class="chart chart-line" chart-colors="payratio.colors" chart-data="payratio.data" chart-labels="payratio.labels" chart-series="payratio.series"></canvas>
                                </div>

                                <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                                    <h4>客单价走势</h4>
                                    <canvas class="chart chart-line" chart-colors="pct.colors" chart-data="pct.data" chart-labels="pct.labels" chart-series="pct.series"></canvas>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                                    <h4>订单组成</h4>
                                    <canvas class="chart chart-pie" chart-colors="platform.colors" chart-data="platform.data" chart-labels="platform.labels" chart-series="platform.series"></canvas>
                                </div>

                                <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                                    <h4>下单用户组成</h4>
                                    <canvas class="chart chart-pie" chart-colors="userplatform.colors" chart-data="userplatform.data" chart-labels="userplatform.labels" chart-series="userplatform.series"></canvas>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
